<template>
	<view>
		<!-- <image src="../../static/video/img.png" class="top-img"></image> -->
		<v-tabs activeColor="#0F0F0F" lineColor="#000000" lineHeight="5rpx" lineScale="0.5" :scroll="false"
			v-model="current" :tabs="tabs" @change="changeTab"></v-tabs>
		<view class="main">
			<view v-if="current==0">
				<view class="tit"><text>*</text>视频名称</view>
				<input v-model="row.title" placeholder="随意取个名字吧" />
				<view class="tit"><text></text>背景音乐</view>
				<input v-model="row.bg_audio" placeholder="音乐格式支持：MP3、ogg、wav" disabled />
				<shmily-drag-image :delImage="delImage2" v-model="audioArr" keyName="url"
					v-if="audioArr.length!=0"></shmily-drag-image>
				<view class="flex align between btns">
					<view class="flex btn-item1" @click="toUploadAudio(1)">
						<uni-icons type="upload" size="20" color="#fff"></uni-icons>
						<text>上传</text>
					</view>
					<view class="flex btn-item2" @click="toUrl(3)"><uni-icons type="list" size="20"
							color="#fff"></uni-icons>
						<text>选择</text>
					</view>
				</view>
				<view class="flex slider align">
					<view>BGM音量</view>
					<view style="width: 80%;position: relative;">
						<u-slider v-model="row.bg_volume" min="0" max="10" :showValue="true"></u-slider>
						<view class="slider-tips">默认10为原始音量，需要调节低音量请调节</view>
					</view>
				</view>
				<!-- 	<view class="tit"><text></text>视频片头</view>
				<input v-model="row.start_video" placeholder="视频格式支持：MP4、ogg、WebM、mov ;" />
				<view class="tips">视频时长在5-20秒最佳
				<view>视频格式支持：MP4、ogg、WebM、mov </view>
				</view>
				<view class="flex align between btns">
					<view class="flex btn-item1">
						<uni-icons type="upload" size="20" color="#fff"></uni-icons>
						<text>上传</text>
					</view>
					<view class="flex btn-item2"><uni-icons type="list" size="20" color="#fff"></uni-icons>
						<text>选择</text>
					</view>
				</view> -->
				<!-- <view class="tit"><text></text>视频片头</view> -->
				<!-- <input v-model="value" placeholder="视频格式支持：MP4、ogg、WebM、mov ;" /> -->
				<!-- <view class="tips">视频时长在5-20秒最佳</view>
				<view class="flex align between btns">
					<view class="flex btn-item1">
						<uni-icons type="upload" size="20" color="#fff"></uni-icons>
						<text>上传</text>
					</view>
					<view class="flex btn-item2"><uni-icons type="list" size="20" color="#fff"></uni-icons>
						<text>选择</text>
					</view>
				</view> -->
				<view class="tit"><text>*</text>视频随机素材</view>
				<input v-model="row.video1" disabled placeholder="视频格式支持：MP4、ogg、WebM、mov ; 图片格式支持：jpg、png、jpeg" />
				<shmily-drag-image :delImage="delImage" v-model="imgVideoArr" keyName="url"
					v-if="imgVideoArr.length!=0"></shmily-drag-image>
				<view class="tips">可上传多个视频与图片随机混剪，每个视频时长应该在5秒以上
					<view>视频格式支持：MP4、ogg、WebM、mov ; 图片格式支持：jpg、png、jpeg </view>
				</view>
				<view class="flex align between btns btns2">
					<view class="flex btn-item1" @click="toUpload()">
						<uni-icons type="upload" size="20" color="#fff"></uni-icons>
						<text>上传</text>
					</view>
					<view class="flex btn-item2" @click="toUrl(2)">
						选择视频
					</view>
					<view class="flex btn-item2" @click="toUrl(1)">
						选择图片
					</view>
				</view>
				<!-- <view class="tit"><text></text>视频片尾</view>
				<input v-model="value" placeholder="视频格式支持：MP4、ogg、WebM、mov ;" />
				<view class="tips">视频时长在5-20秒最佳</view>
				<view class="flex align between btns">
					<view class="flex btn-item1">
						<uni-icons type="upload" size="20" color="#fff"></uni-icons>
						<text>上传</text>
					</view>
					<view class="flex btn-item2"><uni-icons type="list" size="20" color="#fff"></uni-icons>
						<text>选择</text>
					</view>
				</view> -->
				<view class="flex slider align">
					<view>视频原声音量</view>
					<view style="width: 80%;position: relative;">
						<u-slider v-model="row.video_volume" min="0" max="10" :showValue="true"></u-slider>
						<view class="slider-tips">默认0为原始音量，需要调节低音量请调节</view>
					</view>
				</view>
				<view class="subBtn" @click="toChangeTab(1)">下一步</view>
			</view>
			<view v-if="current==1">
				<view class="tit"><text></text>字幕横幅</view>
				<textarea placeholder="通过换行，输入多段横幅，每段在20字内" v-model="row.subtitle"></textarea>
				<view class="tips">
					<view>
						* 每行一段横幅，换行增加新的随机横幅，系统随机取一段，每段在20-30个字
					</view>
					<view>
						* 如需要每段横幅换行展示，请用逗号隔开，最多换行展示4行
					</view>
					<view>
						例如：厂家直销，全国有货源 （此案例用逗号隔开，会展示两行文字）
					</view>
				</view>
				<view class="tit"><text></text>字体/颜色</view>
				<view class="flex align between change">
					<input placeholder="默认字体" v-model="row.subtitle_font_name" disabled @click="show = true" />
					<view @click="open" :style="'background:'+row.subtitle_color+''"></view>
				</view>
				<view class="tit"><text></text>描边/描边颜色</view>
				<view class="flex align between change">
					<input placeholder="无描边" v-model="row.subtitle_outline_name" disabled @click="show2 = true" />
					<view @click="open2" :style="'background:'+row.subtitle_outline_color+''"></view>
				</view>
				<view class="tit" style="color: grey;font-size: 20rpx"><text></text>预览</view>
				<view class="yulan" :style="'color:'+row.subtitle_color+';font-family:'+row.subtitle_font+';-webkit-text-stroke:'+row.subtitle_outline+'px '+row.subtitle_outline_color+''">
					举头望明月，低头思故乡
				</view>
				<view class="tit"><text></text>字体大小</view>
				<input placeholder="默认100" type="digit" v-model="row.subtitle_site" />
				<view class="tit"><text></text>文字位置(距离顶部百分比)</view>
				<input placeholder="默认10%" v-model="row.alignment_name" disabled @click="show3 = true" />
				<view class="tit"><text></text>字幕语音</view>
				<view class="checkbox">
					<uni-data-checkbox v-model="row.diy_yuyin_radio" :localdata="range"></uni-data-checkbox>
				</view>
				<view v-if="row.diy_yuyin_radio==2">
					<view class="tit"><text></text>语音解说</view>
					<textarea v-model="row.sound_text" placeholder="请输入全程的语音解说，如开启解说模式，建议把BGM音量调低，多段语音用换行"></textarea>
				</view>
				<view v-if="row.diy_yuyin_radio==1">
					<view class="tit"><text></text>自定义语音</view>
					<input v-model="row.diy_yuyin" placeholder="音乐格式支持：MP3、ogg、wav" />
					<view class="tips">音乐格式支持：MP3、ogg、wav</view>
					<shmily-drag-image :delImage="delImage3" v-model="audioArr2" keyName="url"
						v-if="audioArr2.length!=0"></shmily-drag-image>
					<view class="flex align between btns">
						<view class="flex btn-item1" @click="toUploadAudio(2)">
							<uni-icons type="upload" size="20" color="#fff"></uni-icons>
							<text>上传</text>
						</view>
						<view class="flex btn-item2" @click="toUrl(3,2)"><uni-icons type="list" size="20"
								color="#fff"></uni-icons>
							<text>选择</text>
						</view>
					</view>
				</view>
				<view class="tips">
					<view>时长预估：10个字预计2.5秒</view>
					<view>
						注意：通过换行可以随机多段解说，如开启解说模式，建议把BGM音量调低
						语句间隔用逗号隔开
					</view>
				</view>
				<view class="tit"><text></text>解说字幕</view>
				<view class="checkbox">
					<uni-data-checkbox v-model="row.open_subtitle" :localdata="range2"></uni-data-checkbox>
				</view>
				<view class="flex slider align">
					<view>口播解说音量</view>
					<view style="width: 80%;position: relative;">
						<u-slider v-model="row.koubo_volume" min="0" max="10" :showValue="true"></u-slider>
						<view class="slider-tips">默认10为原始音量，需要调节低音量请调节</view>
					</view>
				</view>
				<view class="tit"><text></text>解说语速</view>
				<!-- 				<input placeholder="正常" v-model="row.speed" disabled @click="show = true" @cancel="show = false"
					@confirm="confirm" /> -->
				<uni-data-checkbox v-model="row.speed" :localdata="range7"></uni-data-checkbox>
				<view class="tit"><text></text>字幕大小/颜色</view>
				<view class="flex align between change">
					<input placeholder="字体大小建议:55" type="digit" v-model="row.sound_text_size" />
					<view @click="open3" :style="'background:'+row.sound_text_color+''"></view>
				</view>
				<view class="tit"><text></text>描边/描边颜色</view>
				<view class="flex align between change">
					<input placeholder="无描边" v-model="row.sound_text_outline" type="digit" />
					<view @click="open4" :style="'background:'+row.sound_text_outline_color+''"></view>
					<!-- <view style="background: black;"></view> -->
				</view>
				<view class="tit"><text></text>位置(距离顶部百分比)</view>
				<view v-if="row.diy_yuyin_radio==2">
					<input placeholder="默认80%" disabled @click="show4 = true" v-model="row.subtitle_alignment_name" />
					<view class="tit flex align"><text></text>解说语音包<view class="tips">（点击试听）</view>
					</view>
					<view v-if="row.sound_type" style="width: 100%;">
						<audio style="text-align: left;width: 100%"
							:src="'https://jzxt.jiugezixun.cn/storeadmin2/audio/'+row.sound_type+'.mp3'"
							:name="row.sound_type_name" controls></audio>
					</view>
					<view style="max-height: 600rpx;overflow-y: auto;">
						<uni-data-checkbox @change="changeSoundType" v-model="row.sound_type"
							:localdata="range8"></uni-data-checkbox>
					</view>
				</view>
				<!-- <input placeholder="知妙 [多情感女声] [多情感] [荐]" disabled v-model="row.sound_type" /> -->
				<view class="subBtn" @click="toChangeTab(2)">下一步</view>
			</view>
			<view v-if="current==2">
				<!-- <view class="tit"><text>*</text>视频尺寸</view>
				<view class="checkbox">
					<uni-data-checkbox v-model="check" :localdata="range3" @change="change"></uni-data-checkbox>
				</view> -->
				<view class="tit"><text>*</text>剪辑视频数</view>
				<input placeholder="剪辑视频数" type="digit" v-model="row.video_count" />
				<view class="tit"><text>*</text>预计时长（秒）</view>
				<input placeholder="预计时长（秒）" type="digit" v-model="row.video_time" />
				<!-- <view class="tit"><text>*</text>预计时长（秒）</view>
				<view class="flex align between">
					<input placeholder="片头时长" type="digit" />
					<input placeholder="随机素材时长" type="digit" />
					<input placeholder="片尾时长" type="digit" />
				</view> -->
				<!-- <view class="tips">填写了定制时长，时长以定制时长为准，预计时长作为备用预计时长</view> -->
				<!-- <view class="tit"><text></text>视频封面（秒）</view>
				<view class="flex align">
					<input placeholder="视频封面（秒）" type="digit" />
					<view style="color: #707070;font-size: 20rpx;margin-left: 9rpx;">封面图位于成片的第几秒，填0为随机封面</view>
				</view> -->
				<view class="tit"><text>*</text>随机转场</view>
				<view class="checkbox">
					<uni-data-checkbox v-model="row.transition_open" :localdata="range4"></uni-data-checkbox>
				</view>
				<view class="tit"><text>*</text>随机滤镜</view>
				<view class="checkbox">
					<uni-data-checkbox v-model="row.filter_open" :localdata="range5"></uni-data-checkbox>
				</view>
				<view class="tit"><text>*</text>随机画面特效</view>
				<view class="checkbox">
					<uni-data-checkbox v-model="row.stars_open" :localdata="range6"></uni-data-checkbox>
				</view>
				<view class="subBtn" @click="toComfirm()">确定</view>
			</view>
		</view>
		<!-- 字体 -->
		<u-picker :show="show" :columns="columns" keyName="name" @cancel="show = false" @confirm="confirm"></u-picker>
		<!-- 字幕描边 -->
		<u-picker :show="show2" :columns="columns2" keyName="name" @cancel="show2 = false"
			@confirm="confirm2"></u-picker>
		<!-- 位置(距离顶部百分比): -->
		<u-picker :show="show3" :columns="columns3" keyName="name" @cancel="show3 = false"
			@confirm="confirm3"></u-picker>
		<u-picker :show="show4" :columns="columns4" keyName="name" @cancel="show4 = false"
			@confirm="confirm4"></u-picker>
		<!-- 需要声明 ref  -->
		<t-color-picker ref="colorPicker" :color="color" @confirm="confirmColor"></t-color-picker>
		<t-color-picker ref="colorPicker2" :color="color2" @confirm="confirmColor2"></t-color-picker>
		<t-color-picker ref="colorPicker3" :color="color3" @confirm="confirmColor3"></t-color-picker>
		<t-color-picker ref="colorPicker4" :color="color4" @confirm="confirmColor4"></t-color-picker>
	</view>
</template>

<script>
	import {
		generalAttachment,
		aliossNotify
	} from '@/api/apiData.js';
	import {
		uploadOss
	} from '@/until/oss/oss.js'
	import tColorPicker from '@/components/t-color-picker/t-color-picker.vue'
	export default {
		components: {
			tColorPicker
		},
		data() {
			return {
				color: {
					r: 255,
					g: 255,
					b: 255,
					a: 1.0
				},
				color2: {
					r: 255,
					g: 255,
					b: 255,
					a: 1.0
				},
				color3: {
					r: 255,
					g: 255,
					b: 255,
					a: 1.0
				},
				color4: {
					r: 255,
					g: 255,
					b: 255,
					a: 1.0
				},
				slider1: 10,
				current: 0,
				slider2: 0,
				tabs: ['视频素材&音乐', '横幅&口播字幕', '时长&效果'],
				check: 0,
				range: [{
					"value": 2,
					"text": "字幕转语音"
				}, {
					"value": 1,
					"text": "自定义语音转字幕"
				}],
				range2: [{
					"value": 1,
					"text": "开启"
				}, {
					"value": 0,
					"text": "关闭"
				}],
				show: false,
				columns: [ //字幕字体
					[{
							name: '默认字体',
							value: ''
						}, {
							name: '寒蝉正楷体',
							value: 'hanchanzhengkaiti'
						},
						{
							name: '汉仪永字流云隶字体',
							value: 'hanyiyongziliuyunli'
						},
						{
							name: '江城月湖体',
							value: 'jiangchengyuehuti'
						},
						{
							name: '汉字之美朝歌大宋',
							value: 'hanzizhimeichaogedasong'
						},
						{
							name: '宇文天弯字体',
							value: 'yuwentianqiong'
						},
						{
							name: '汉仪永字小熊猫字体',
							value: 'hanyiyongzixiaoxiongmao'
						},
						{
							name: '颜真卿多宝塔碑',
							value: 'yanzhenqingduobaotabei'
						},
						{
							name: '焦糖日落可可体',
							value: 'jiaotangriluokeketi'
						},
						{
							name: '玄冬楷书字体',
							value: 'xuandongkaishu'
						},
						{
							name: '寒蝉圆黑体',
							value: 'hanchanyuanheiti'
						},
						{
							name: '现代几何体',
							value: 'xiandaijiheti'
						},
						{
							name: '汤宪滨宋',
							value: 'tangxianbinsong'
						},
						{
							name: '阿里妈妈东方大楷',
							value: 'alimamadongfangdakai'
						},
						{
							name: '润植家刻本简体',
							value: 'runzhijiakebenjianti'
						},
						{
							name: '创艺简隶书',
							value: 'chuangyijianlishu'
						},
						{
							name: '颜简体',
							value: 'yanjianti'
						},
						{
							name: '字魂5号-无外润黑体',
							value: 'wuwairunheiti'
						},
						{
							name: '小恐龙体',
							value: 'xiaokonglongti'
						},
						{
							name: '贤黑',
							value: 'xianhei'
						},
						{
							name: '方格习字体',
							value: 'fanggexiziti'
						},
						{
							name: '正酷超级黑',
							value: 'zhengkuchaojihei'
						},
						{
							name: '朗圆体',
							value: 'langyuanti'
						},
						{
							name: '正酷雪花黑',
							value: 'zhengkuxuehuahei'
						},
						{
							name: '机甲超级黑',
							value: 'jijiachaojihei'
						},
						{
							name: '江户川招牌体',
							value: 'jianghuchuanzhaopaiti'
						},
						{
							name: '方悦黑',
							value: 'fangyuehei'
						},
						{
							name: '伊人黑',
							value: 'yirenhei'
						},
						{
							name: '创粗圆',
							value: 'chuangcuyuan'
						},
						{
							name: '飞驰标题体',
							value: 'feichibiaotiti'
						},
						{
							name: '星驰闪电体',
							value: 'xingchishandianti'
						},
						{
							name: '星岩乐黑体',
							value: 'xingyanleheiti'
						},
					]
				],
				show2: false,
				columns2: [ //字幕描边
					[{
							name: '无描边',
							value: 0
						},
						{
							name: '1像素',
							value: 1
						},
						{
							name: '2像素',
							value: 2
						},
						{
							name: '3像素',
							value: 3
						},
						{
							name: '4像素',
							value: 4
						},
						{
							name: '5像素',
							value: 5
						}
					]
				],
				show3: false,
				columns3: [ //字幕描边
					[{
						name: '随机(顶部/居中/底部)',
						value: 0
					}, {
						name: '10%',
						value: 10
					}, {
						name: '15%',
						value: 15
					}, {
						name: '20%',
						value: 20
					}, {
						name: '25%',
						value: 25
					}, {
						name: '30%',
						value: 30
					}, {
						name: '35%',
						value: 30
					}, {
						name: '40%',
						value: 40
					}, {
						name: '45%',
						value: 45
					}, {
						name: '50%',
						value: 50
					}, {
						name: '55%',
						value: 55
					}, {
						name: '60%',
						value: 60
					}, {
						name: '65%',
						value: 65
					}, {
						name: '70%',
						value: 70
					}, {
						name: '75%',
						value: 75
					}, {
						name: '80%',
						value: 80
					}, {
						name: '85%',
						value: 85
					}, {
						name: '90%',
						value: 90
					}]
				],
				show4: false,
				columns4: [ //字幕描边
					[{
						name: '随机(顶部/居中/底部)',
						value: 0
					}, {
						name: '10%',
						value: 10
					}, {
						name: '15%',
						value: 15
					}, {
						name: '20%',
						value: 20
					}, {
						name: '25%',
						value: 25
					}, {
						name: '30%',
						value: 30
					}, {
						name: '35%',
						value: 30
					}, {
						name: '40%',
						value: 40
					}, {
						name: '45%',
						value: 45
					}, {
						name: '50%',
						value: 50
					}, {
						name: '55%',
						value: 55
					}, {
						name: '60%',
						value: 60
					}, {
						name: '65%',
						value: 65
					}, {
						name: '70%',
						value: 70
					}, {
						name: '75%',
						value: 75
					}, {
						name: '80%',
						value: 80
					}, {
						name: '85%',
						value: 85
					}, {
						name: '90%',
						value: 90
					}]
				],
				range3: [{
					"value": 0,
					"text": "手机竖屏版"
				}, {
					"value": 1,
					"text": "电脑横屏版"
				}],
				range4: [{
					"value": 1,
					"text": "开启"
				}, {
					"value": 0,
					"text": "关闭"
				}],
				range5: [{
					"value": 1,
					"text": "开启"
				}, {
					"value": 0,
					"text": "关闭"
				}],
				range6: [{
					"value": 1,
					"text": "开启"
				}, {
					"value": 0,
					"text": "关闭"
				}],
				range7: [{
					"value": 1,
					"text": "正常"
				}, {
					"value": 1.1,
					"text": "1.1倍速"
				}, {
					"value": 1.2,
					"text": "1.2倍速"
				}, {
					"value": 1.3,
					"text": "1.3倍速"
				}, {
					"value": 1.4,
					"text": "1.4倍速"
				}, {
					"value": 1.5,
					"text": "1.5倍速"
				}, {
					"value": 1.6,
					"text": "1.6倍速"
				}, {
					"value": 1.7,
					"text": "1.7倍速"
				}, {
					"value": 1.8,
					"text": "1.8倍速"
				}, {
					"value": 1.9,
					"text": "1.9倍速"
				}, {
					"value": 2,
					"text": "2倍速"
				}],
				range8: [{
					"value": 'zhimiao_emo',
					"text": "知妙 [多情感女声] [多情感] [荐]",
					// "url":'https://jzxt.jiugezixun.cn/storeadmin2/audio/zhibei_emo.mp3'
				}, {
					"value": 'zhimi_emo',
					"text": "知米 [亲和女声] [多情感] [荐]"
				}, {
					"value": 'zhibei_emo',
					"text": "知贝 [活力童声] [多情感] [荐]"
				}, {
					"value": 'zhiyan_emo',
					"text": "知燕 [直播女声] [多情感] [荐]"
				}, {
					"value": 'zhitian_emo',
					"text": "知甜 [甜美女声] [多情感] [荐]"
				}, {
					"value": 'zhitian',
					"text": "知甜 [超高清甜美女声] [超高清] [荐]"
				}, {
					"value": 'zhiqing',
					"text": "知青 [台湾话女生] [超高清] [荐]"
				}, {
					"value": 'zhichu',
					"text": "知厨 [舌尖男声] [超高清] [荐]"
				}, {
					"value": 'zhide',
					"text": "知德 [新闻男声] [超高清] [荐]"
				}, {
					"value": 'zhifei',
					"text": "知飞 [激昂解说] [超高清] [荐]"
				}, {
					"value": 'zhijia',
					"text": "知佳 [标准女声] [超高清] [荐]"
				}, {
					"value": 'zhilun',
					"text": "知伦 [悬疑解说] [超高清] [荐]"
				}, {
					"value": 'zhinan',
					"text": "知楠 [广告男声] [超高清] [荐]"
				}, {
					"value": 'zhiqi',
					"text": "知琪 [温柔女声] [超高清] [荐]"
				}, {
					"value": 'zhiqian',
					"text": "知倩 [资讯女声] [超高清] [荐]"
				}, {
					"value": 'zhiru',
					"text": "知茹 [新闻女声] [超高清] [荐]"
				}, {
					"value": 'zhiwei',
					"text": "知薇 [萝莉女声] [超高清] [荐]"
				}, {
					"value": 'zhixiang',
					"text": "知祥 [磁性男声] [超高清] [荐]"
				}, {
					"value": 'zhiya',
					"text": "知雅 [普通话女声] [客服]"
				}, {
					"value": 'aixia',
					"text": "艾夏 [亲和女声] [客服]"
				}, {
					"value": 'aiyue',
					"text": "艾悦 [温柔女声] [客服]"
				}, {
					"value": 'aiya',
					"text": "艾雅 [严厉女声] [客服]"
				}, {
					"value": 'aijing',
					"text": "艾婧 [严厉女声] [客服]"
				}, {
					"value": 'aimei',
					"text": "艾美 [甜美女声] [客服]"
				}, {
					"value": 'siyue',
					"text": "思悦 [温柔女声] [客服]"
				}, {
					"value": 'aina',
					"text": "艾娜 [浙普女声] [客服]"
				}, {
					"value": 'aishuo',
					"text": "艾硕 [自然男声] [客服]"
				}, {
					"value": 'aiyu',
					"text": "艾雨 [自然女声] [客服]"
				}, {
					"value": 'xiaomei',
					"text": "小美 [甜美女声] [客服]"
				}, {
					"value": 'yina',
					"text": "伊娜 [浙普女声] [客服]"
				}, {
					"value": 'sijing',
					"text": "思婧 [严厉女声] [客服]"
				}, {
					"value": 'zhiyuan',
					"text": "知媛 [普通话女声] [通用]"
				}, {
					"value": 'zhiyue',
					"text": "知悦 [普通话女声] [通用]"
				}, {
					"value": 'zhistella',
					"text": "知莎 [普通话女声] [通用]"
				}, {
					"value": 'zhigui',
					"text": "知柜 [普通话女声] [通用]"
				}, {
					"value": 'zhishuo',
					"text": "知硕 [普通话男声] [通用]"
				}, {
					"value": 'zhida',
					"text": "知达 [普通话男声] [通用]"
				}, {
					"value": 'aiqi',
					"text": "艾琪 [温柔女声] [通用]"
				}, {
					"value": 'aicheng',
					"text": "艾诚 [标准男声] [通用]"
				}, {
					"value": 'aijia',
					"text": "艾佳 [标准女声] [通用]"
				}, {
					"value": 'siqi',
					"text": "思琪 [温柔女声] [通用]"
				}, {
					"value": 'sijia',
					"text": "思佳 [标准女声] [通用]"
				}, {
					"value": 'mashu',
					"text": "马树 [儿童剧男声] [通用]"
				}, {
					"value": 'yuer',
					"text": "悦儿 [儿童剧女声] [通用]"
				}, {
					"value": 'ruoxi',
					"text": "若兮 [温柔女声] [通用]"
				}, {
					"value": 'aida',
					"text": "艾达 [标准男声] [通用]"
				}, {
					"value": 'sicheng',
					"text": "思诚 [标准男声] [通用]"
				}, {
					"value": 'ninger',
					"text": "宁儿 [标准女声] [通用]"
				}, {
					"value": 'xiaoyun',
					"text": "小云 [标准女声] [通用]"
				}, {
					"value": 'xiaogang',
					"text": "小刚 [标准男声] [通用]"
				}, {
					"value": 'ruilin',
					"text": "瑞琳 [标准女声] [通用]"
				}, {
					"value": 'zhimao',
					"text": "知猫 [普通话女声] [直播]"
				}, {
					"value": 'laomei',
					"text": "老妹 [吆喝女声] [直播]"
				}, {
					"value": 'laotie',
					"text": "老铁 [东北老铁] [直播]"
				}, {
					"value": 'xiaoxian',
					"text": "小仙 [亲切女声] [直播]"
				}, {
					"value": 'guijie',
					"text": "柜姐 [亲切女声] [直播]"
				}, {
					"value": 'stella',
					"text": "Stella [知性女声] [直播]"
				}, {
					"value": 'maoxiaomei',
					"text": "猫小美 [活力女声] [直播]"
				}, {
					"value": 'qiaowei',
					"text": "巧薇 [卖场主播] [直播]"
				}, {
					"value": 'ailun',
					"text": "艾伦 [悬疑解说] [直播]"
				}, {
					"value": 'aifei',
					"text": "艾飞 [激昂解说] [直播]"
				}, {
					"value": 'yaqun',
					"text": "亚群 [卖场广播] [直播]"
				}, {
					"value": 'stanley',
					"text": "Stanley [沉稳男声] [直播]"
				}, {
					"value": 'kenny',
					"text": "Kenny [温暖男声] [直播]"
				}, {
					"value": 'rosa',
					"text": "rosa [自然女声] [直播]"
				}, {
					"value": 'aitong',
					"text": "艾彤 [儿童音] [童声]"
				}, {
					"value": 'aiwei',
					"text": "艾薇 [萝莉女声] [童声]"
				}, {
					"value": 'jielidou',
					"text": "杰力豆 [治愈童声] [童声]"
				}, {
					"value": 'xiaobei',
					"text": "小北 [萝莉女声] [童声]"
				}, {
					"value": 'sitong',
					"text": "思彤 [儿童音] [童声]"
				}, {
					"value": 'aibao',
					"text": "艾宝 [萝莉女声] [童声]"
				}, {
					"value": 'cuijie',
					"text": "翠姐 [东北话女声] [方言]"
				}, {
					"value": 'kelly',
					"text": "Kelly [香港粤语女声] [方言]"
				}, {
					"value": 'jiajia',
					"text": "佳佳 [粤语女声] [方言]"
				}, {
					"value": 'dahu',
					"text": "大虎 [东北话男声] [方言]"
				}, {
					"value": 'aikan',
					"text": "艾侃 [天津话男声] [方言]"
				}, {
					"value": 'taozi',
					"text": "桃子 [粤语女声] [方言]"
				}, {
					"value": 'qingqing',
					"text": "青青 [台湾话女声] [方言]"
				}, {
					"value": 'xiaoze',
					"text": "小泽 [湖南重口音] [方言]"
				}, {
					"value": 'shanshan',
					"text": "姗姗 [粤语女声] [方言]"
				}, {
					"value": 'chuangirl',
					"text": "小玥 [四川话女声] [方言]"
				}],
				row: {
					title: '', //任务名称
					bg_audio: '', //视频配音BGM
					bg_volume: 10, //BGM音量
					start_video: '', //视频片头
					video1: '', //视频随机素材
					end_video: '', //视频片尾
					video_volume: 0, //视频原声音量
					subtitle: '', //字幕横幅
					subtitle_font: '', //字体
					subtitle_font_name: '', //字体
					subtitle_color: '#ffffff', //字体/颜色
					subtitle_outline: '0', //描边
					subtitle_outline_name: '无描边',
					subtitle_outline_color: '', //描边颜色
					subtitle_site: '100', //字体大小
					alignment: '15', //位置(距离顶部百分比)
					alignment_name: '15%', //位置(距离顶部百分比)
					diy_yuyin_radio: 2, //字幕语音:1自定义语音转字幕 2字幕转语音
					sound_text: '', //语音解说
					diy_yuyin: '', //自定义语音
					open_subtitle: 1, //解说字幕 1:开启 0关闭
					koubo_volume: 10, //口播解说音量
					speed: 1, //解说语速 1正常
					sound_text_size: 55, //字幕大小
					sound_text_color: '#ffffff', //字幕颜色
					sound_text_outline: 3, //描边大小
					sound_text_outline_color: '#000000', //描边颜色
					subtitle_alignment: '80', //位置(距离顶部百分比)
					subtitle_alignment_name: '80%', //位置(距离顶部百分比)
					sound_type: 'zhimiao_emo', //解说语音包 zhimiao_emo：知妙
					sound_type_name: '知妙 [多情感女声] [多情感] [荐]', //解说语音包 zhimiao_emo：知妙
					view_size: 1, //视频尺寸:1手机竖屏版 2电脑横屏版
					video_count: '1', //剪辑视频数
					video_time: '30', //预计时长(秒)
					start_duration: '', //定制时长(秒):片头时长
					video_duration: '', //定制时长(秒):随机素材时长
					end_duration: '', //定制时长(秒):片尾时长
					cover_time: '', //视频封面(秒)
					transition_open: 1, //随机转场:1:开启 0关闭
					filter_open: 0, //随机滤镜:1:开启 0关闭
					stars_open: 0, //随机画面特效:1:开启 0关闭
				},
				imgArr: [],
				videoArr: [],
				audioArr: [],
				audioArr2: [],
				imgVideoArr: [],
			};
		},
		onShow() {
			if (uni.getStorageSync('imgVideoArr')) {
				this.imgVideoArr = uni.getStorageSync('imgVideoArr')
				let arr = []
				this.imgVideoArr.forEach((item => {
					arr.push(item.url)
				}))
				this.row.video1 = arr.toString()
			}
			if (uni.getStorageSync('audio')) {
				this.audioArr = uni.getStorageSync('audio')
				let arr2 = []
				this.audioArr.forEach((item => {
					arr2.push(item.url)
				}))
				this.row.bg_audio = arr2.toString()
			}
			if (uni.getStorageSync('audio2')) {
				this.audioArr2 = uni.getStorageSync('audio2')
				let arr3 = []
				this.audioArr2.forEach((item => {
					arr3.push(item.url)
				}))
				this.row.diy_yuyin = arr3.toString()
			}

		},
		methods: {
			// 滚动到顶部
			scrollToTop() {
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 300 // 动画时长，默认300ms，可以设置为0表示无动画直接跳转
				});
			},
			changeSoundType(e) {
				console.log(e)
				this.row.sound_type = e.detail.data.value
				this.row.sound_type_name = e.detail.data.text
			},
			open(item) {
				// 打开颜色选择器
				this.$refs.colorPicker.open();
			},
			open2(item) {
				// 打开颜色选择器
				this.$refs.colorPicker2.open();
			},
			open3(item) {
				// 打开颜色选择器
				this.$refs.colorPicker3.open();
			},
			open4(item) {
				// 打开颜色选择器
				this.$refs.colorPicker4.open();
			},
			confirmColor(e) {
				this.row.subtitle_color = e.hex
			},
			confirmColor2(e) {
				this.row.subtitle_outline_color = e.hex
			},
			confirmColor3(e) {
				this.row.sound_text_color = e.hex
			},
			confirmColor4(e) {
				this.row.sound_text_outline_color = e.hex
			},
			// 上传视频/图片
			toUpload() {
				let that = this
				// uni.showLoading({
				// 	title: "loading",
				// 	mask: true
				// })
				uni.chooseMedia({
					count: 9,
					mediaType: ['image', 'video'],
					sourceType: ['camera', 'album'], //从相册选择
					success: (res) => {
						console.log(res)
						let fileArr = res.tempFiles
						let length = fileArr.length
						fileArr.forEach((item, index) => {
							console.log(item.tempFilePath)
							that.toOss(item.tempFilePath, index, item.fileType, item.size, new Date()
								.getTime())
						})
					},
					fail() {
						uni.hideLoading()
					}
				})
			},
			// 上传音频
			toUploadAudio(n) {
				let that = this
				uni.chooseMessageFile({
					count: 1,
					extension: [".mp3"],
					success: (res) => {
						console.log("从聊天记录中获取文件", res);
						const {
							errMsg,
							tempFiles
						} = res;
						if (errMsg == "chooseMessageFile:ok" && tempFiles.length) {
							const {
								name,
								size,
								path
							} = tempFiles[0];
							console.log("临时文件", {
								size,
								path
							});
							if (name.slice(-4) != ".mp3") {
								return uni.showToast({
									icon: "none",
									title: "请上传mp3文件！",
									duration: 2000,
								});
							}
							that.toOss(path, 1, 'audio', size, name, n)
							// this.uploadFile(path);
						}
					},
				});
			},
			async toOss(item, index, fileType, size, name, n) {
				const time = uni.$u.timeFormat(new Date().getTime(), 'yyyymm/dd')
				let ossPath = await uploadOss({
					filePathFore: time + '/',
					filePath: item,
				})
				let url = 'https://hongchuquan.oss-cn-shanghai.aliyuncs.com/' + ossPath
				console.log(url)
				if (fileType == 'audio') {
					if (n == 1) {
						let arr = [{
							type: fileType,
							url: url
						}]
						this.audioArr = this.audioArr.concat(arr)
						let arr2 = []
						this.audioArr.forEach((item => {
							arr2.push(item.url)
						}))
						this.row.bg_audio = arr2.toString()
						uni.setStorageSync('audio', this.audioArr);
					} else {
						let arr = [{
							type: fileType,
							url: url
						}]
						this.audioArr2 = this.audioArr2.concat(arr)
						let arr2 = []
						this.audioArr2.forEach((item => {
							arr2.push(item.url)
						}))
						this.row.diy_yuyin = arr2.toString()
						uni.setStorageSync('audio2', this.audioArr2);
					}

				}
				if (fileType == 'image' || fileType == 'video') {
					let arr = [{
						type: fileType,
						url: url
					}]
					this.imgVideoArr = this.imgVideoArr.concat(arr)
					let arrs = []
					this.imgVideoArr.forEach((item => {
						arrs.push(item.url)
					}))
					this.row.video1 = arrs.toString()
					uni.setStorageSync('imgVideoArr', this.imgVideoArr);
				}

				// this.toComf(url, fileType, size, name)
			},
			async toComf(url, fileType, size, name) {
				uni.showLoading({
					title: "loading",
					mask: true
				})
				const result = await aliossNotify({
					url: url,
					name: name,
					size: size,
					type: fileType,
				})
				if (result.code == 1) {
					uni.hideLoading()
					uni.showToast({
						title: '上传成功'
					})
				} else {
					uni.hideLoading()
					uni.showToast({
						title: result.msg,
						icon: 'error'
					})
				}
			},
			// 确定剪辑
			toComfirm() {
				if (this.imgVideoArr.length != 0) {
					let arrs = []
					this.imgVideoArr.forEach((item => {
						arrs.push(item.url)
					}))
					this.row.video1 = arrs.toString()
				}
				if (this.audioArr.length != 0) {
					let arr2 = []
					this.audioArr.forEach((item => {
						arr2.push(item.url)
					}))
					this.row.bg_audio = arr2.toString()
				}
				if (this.audioArr2.length != 0) {
					let arr3 = []
					this.audioArr2.forEach((item => {
						arr3.push(item.url)
					}))
					this.row.diy_yuyin = arr3.toString()
				}
				let that = this
				let obj = {
					'row[title]': this.row.title,
					'row[bg_audio]': this.row.bg_audio,
					'row[bg_volume]': this.row.bg_volume,
					'row[start_video]': this.row.start_video,
					'row[video1]': this.row.video1,
					'row[end_video]': this.row.end_video,
					'row[video_volume]': this.row.video_volume,
					'row[subtitle]': this.row.subtitle,
					'row[subtitle_font]': this.row.subtitle_font,
					'row[subtitle_color]': this.row.subtitle_color,
					'row[subtitle_outline]': this.row.subtitle_outline,
					'row[subtitle_outline_color]': this.row.subtitle_outline_color,
					'row[subtitle_site]': this.row.subtitle_site,
					'row[alignment]': this.row.alignment,
					'row[diy_yuyin_radio]': this.row.diy_yuyin_radio,
					'row[diy_yuyin]': this.row.diy_yuyin,
					'row[sound_text]': this.row.sound_text,
					'row[open_subtitle]': this.row.open_subtitle,
					'row[koubo_volume]': this.row.koubo_volume,
					'row[speed]': this.row.speed,
					'row[sound_text_size]': this.row.sound_text_size,
					'row[sound_text_color]': this.row.sound_text_color,
					'row[sound_text_outline]': this.row.sound_text_outline,
					'row[sound_text_outline_color]': this.row.sound_text_outline_color,
					'row[subtitle_alignment]': this.row.subtitle_alignment,
					'row[sound_type]': this.row.sound_type,
					'row[view_size]': this.row.view_size,
					'row[video_count]': this.row.video_count,
					'row[video_time]': this.row.video_time,
					'row[start_duration]': this.row.start_duration,
					'row[video_duration]': this.row.video_duration,
					'row[end_duration]': this.row.end_duration,
					'row[cover_time]': this.row.cover_time,
					'row[transition_open]': this.row.transition_open,
					'row[filter_open]': this.row.filter_open,
					'row[stars_open]': this.row.stars_open,
				}
				console.log(obj)
				if (this.row.title == '') {
					uni.showToast({
						title: '请输入视频名称',
						icon: 'none'
					})
					return false
				}
				if (this.row.video1 == '') {
					uni.showToast({
						title: '请上传视频随机素材',
						icon: 'none'
					})
					return false
				}
				uni.showLoading({
					title: "loading",
					mask: true
				})
				uni.request({
					url: 'https://jzxt.jiugezixun.cn/storeadmin/make_video/add?type=2',
					data: obj,
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'X-Requested-With': 'XMLHttpRequest',
						'Cookie': uni.getStorageSync('cookies') // 从存储中读取cookies并设置到请求头
					},
					success: result => {
						if (result.data.code == 1) {
							uni.showToast({
								title: '添加成功'
							})
							setTimeout(() => {
								uni.removeStorageSync('audio')
								uni.removeStorageSync('imgVideoArr')
								uni.removeStorageSync('audio2')
								uni.navigateBack()
							}, 500)
						} else {
							uni.showToast({
								title: result.data.msg,
								icon: 'none'
							})
						}
					},
					fail: result => {
						uni.hideLoading();
					}
				})
			},
			sortList() {
				console.log(this.imgVideoArr)
			},
			delImage(done) {
				let that = this
				uni.showModal({
					content: '是否删除?',
					success: (res) => {
						if (res.confirm) {
							// 执行 done() 删除

							done()
							let arr = []
							that.imgVideoArr.forEach((item => {
								arr.push(item.url)
							}))
							that.row.video1 = arr.toString()
							uni.setStorageSync('imgVideoArr', that.imgVideoArr);
						}
					}
				})
			},
			delImage2(done) {
				let that = this
				uni.showModal({
					content: '是否删除?',
					success: (res) => {
						if (res.confirm) {
							// 执行 done() 删除
							done()
							let arr = []
							that.audioArr.forEach((item => {
								arr.push(item.url)
							}))
							that.row.bg_audio = arr.toString()
							uni.setStorageSync('audio', that.audioArr);
						}
					}
				})
			},
			toUrl(n, s) {
				if (s) {
					uni.navigateTo({
						url: '/pages/material/material?type=' + n + '&type3=' + s
					})
				} else {
					uni.navigateTo({
						url: '/pages/material/material?type=' + n
					})
				}
			},
			changeTab(index) {
				this.current = index
				this.scrollToTop()
			},
			toChangeTab(n) {
				this.current = n
				this.scrollToTop()
			},
			confirm(e) {
				this.row.subtitle_font = e.value[0].value
				this.row.subtitle_font_name = e.value[0].name
				this.show = false
			},
			confirm2(e) {
				this.row.subtitle_outline = e.value[0].value
				this.row.subtitle_outline_name = e.value[0].name
				this.show2 = false
			},
			confirm3(e) {
				this.row.alignment = e.value[0].value
				this.row.alignment_name = e.value[0].name
				this.show3 = false
			},
			confirm4(e) {
				this.row.subtitle_alignment = e.value[0].value
				this.row.subtitle_alignment_name = e.value[0].name
				this.show4 = false
			}
		}
	}
</script>

<style lang="scss" scoped>
	.yulan {
		margin-bottom: 23rpx;
		text-align: center;
		background: ghostwhite;
		padding: 20rpx 0;
	}

	.top-img {
		width: 100%;
		height: 422rpx;
	}

	.main {
		margin-top: 15rpx;
		background: white;
		padding: 7rpx 30rpx;

		.title {
			font-size: 32rpx;
			font-weight: bold;
		}

		.tit {
			font-size: 28rpx;
			margin: 17rpx 0;

			text {
				color: #FF0000;
			}
		}

		input {
			padding: 14rpx 15rpx;
			font-size: 20rpx;
			border: solid 1rpx #707070;
			border-radius: 10rpx;
		}

		.btns {
			margin: 20rpx 40rpx;

			view {
				width: 250rpx;
				height: 60rpx;
				line-height: 60rpx;
				border-radius: 10rpx;
				justify-content: center;
				color: white;
				text-align: center;
			}

			.btn-item1 {
				background: #DD4E3D;
			}

			.btn-item2 {
				background: #5D9CEB;
			}

			text {
				margin-left: 10rpx;
			}
		}

		.btns2 {
			margin: 20rpx 0;

			view {
				width: 200rpx;
			}
		}

		.tips {
			font-size: 20rpx;
			margin: 15rpx 0;
		}

		.slider {
			font-size: 20rpx;

			.slider-tips {
				font-size: 20rpx;
				position: absolute;
				bottom: 0;
				left: 30rpx;
			}
		}

		.subBtn {
			font-size: 30rpx;
			color: white;
			padding: 8rpx 95rpx;
			background: #5D9CEB;
			width: fit-content;
			margin: 137rpx auto;
			border-radius: 10rpx;
		}

		textarea {
			border: solid 1rpx #707070;
			padding: 15rpx 9rpx;
			border-radius: 10rpx;
			font-size: 20rpx;
		}

		.change {
			input {
				width: 80%;
			}

			view {
				width: 44rpx;
				height: 44rpx;
				border: solid 8rpx #E0E0E0;
				background: white;
				border-radius: 4rpx;
			}
		}
	}
</style>